@charset "utf-8";

@import "common";

@mixin number($color){
    display: inline-block;
    height: 53px;
    width: 55px;
    margin-right: 10px;
    border-radius: 3px;
    line-height: 53px;
    text-align: center;
    background-color: #fff;
    color: $color;
}


//Laya-flash
.laya_flash{
    background-color: #8bc01f;
    color: #fff;
    padding-bottom: 60px;
    padding-top: 60px;
    .f_flash{
        .f_desc{
            h3{
                margin-bottom: 23px;
                font-size: 48px;
                span{
                    @include number(#8bc01f);
                }
            }
            div{
                margin-left: 15px;
                h4{
                    margin-bottom: 60px;
                    font-size: 24px;
                }
                p{
                    font-size: 14px;
                    line-height: 30px;
                    margin-bottom: 30px;
                }
                a{
                    display: block;
                    width: 100px;
                    height: 34px;
                    line-height: 34px;
                    text-align: center;
                    border-radius: 3px;
                    background-color: #fff;
                    font-size: 14px;
                    color: #8bc01f;
                }
            }
        }
        .f_pic{
            img{
                width: 100%;
                height: auto;
                display: block;
            }
        }
    }
}

//laya_player
.laya_player{
    background-color: #3393df;
    color: #fff;
    .p_content{
        position: relative;
        height: auto;
        &::after{
            content: "";
            display: block;
            clear: both;
        }
        h3{
            font-size: 48px;
            span{
                @include number(#3393df)
            }
        }
        .p_pica{
            height: auto;
            margin-top: 0;
            margin-bottom: auto;
            img{
                display: block;
                width: 100%;
                height: 100%;
            }
        }
        .p_desc{
            p{
                font-size: 14px;
                line-height: 2.1em;
                margin-bottom: 33px;
            }
        }
        .p_picb{
            bottom: 0;
            height: 100%;
            div{
                position: absolute;
                right: 0;
                height: auto;
                padding-right: 3.4%;
                padding-left: 2.7%;
                margin-bottom: 0 !important;
                margin-top: auto;
                img{
                    display: block;
                    width: 100%;
                    height: 100%;
                }
            }
        }
    }
}

//laya_aosp
.f_aosp{
    .aosp_content{
        &::after{
            content: "";
            display: block;
            clear: both;
        }
        li{
            padding: 80px 15px;
            h3{
                margin-bottom: 25px;
                font-size: 42px;
                color: #3393df;
                span{
                    display: inline-block;
                    width: 40px;
                    height: 41px;
                    margin-right: 12px;
                    line-height: 41px;
                    text-align: center;
                    border-radius: 2px;
                    background-color: #3393df;
                    color: #fff;
                }
            }
            h4{
                margin-bottom: 37px;
                font-size: 18px;
                color: #5d5d5d;
            }
            h5{
                font-size: 18px;
                color: #3393df;
                margin-bottom: 20px;
            }
            p{
                margin-bottom: 35px;
                font-size: 14px;
                line-height: 1.8em;
                color: #5d5d5d;
                text-indent: 2em;
                text-align: justify;
            }
            div{
                height: 141px;
                width: 141px;
                overflow: hidden;
                margin: 0 auto;
                img{
                    width: 100%;
                    height: 100%;
                    display: block;
                }
            }
        }
    }
}

.aosp_2{
    background-color: #f7f7f7;
}
